<template>
  <a-popover trigger="click" v-model:popup-visible="visible">
    <a-tag v-if="props.type == 'signFor'" class="tag-btn mb5 ml5 gray-outline cursor" size="small">签收</a-tag>
    <a-tag v-if="props.type == 'reject'" class="tag-btn mb5 ml5 gray-outline cursor" size="small">拒收</a-tag>
    <template #content>
      <div v-if="props.type == 'signFor'"> 请再次确认签收通过？ </div>
      <div v-else>
        <div>请填写拒收原因</div>
        <div><a-textarea v-model="remark" placeholder="请输入拒收原因" /></div>
      </div>

      <a-descriptions :data="deliveryInfo" :label-style="{ textAlign: 'right' }" :column="3" bordered>
        <template #label="{ label, data }">
          <div v-if="!data.tip">{{ label }}：</div>
          <a-popover :content="data.tip" v-else>
            <p>
              <icon-question-circle />
              <span>{{ label }}</span>
            </p>
          </a-popover>
        </template>

        <template #value="{ label, data }">
          <div v-if="data.label == '半成品毛坯供应方'">{{ getSupplierName(props.info) }}</div>
          <div v-if="data.label == '数量'">{{ props.info.qtyPurchase }}</div>
          <div v-if="data.label == '材质单价(元/g)'">{{ props.info.supplierCloseCost.amtAvgMaterial }}</div>
          <div v-if="data.label == '单件加工费'">{{ props.info.supplierCloseCost.amtAvgProcess }}</div>
          <div v-if="data.label == '材质净重(g)'">{{ props.info.supplierCloseCost.wgtNetMaterial }} </div>
          <div v-if="data.label == '损耗率(%)'">{{ props.info.supplierCloseCost.attritionRate }}</div>
          <div v-if="data.label == '连耗重量(g)'">{{ props.info.supplierCloseCost.wgtContinueAttrition }}</div>
          <div v-if="data.label == '材质金额'">{{ props.info.supplierCloseCost.amtMaterial }}</div>
          <div v-if="data.label == '加工费'">{{ props.info.supplierCloseCost.amtProcess }}</div>
          <div v-if="data.label == '石头费用'">{{ props.info.supplierCloseCost.amtStone }}</div>
          <div v-if="data.label == '链条费用'">{{ props.info.supplierCloseCost.amtChain }}</div>
          <div v-if="data.label == '其他费用'">{{ props.info.supplierCloseCost.amtOther }}</div>
          <div v-if="data.label == '合计金额'">{{ props.info.supplierCloseCost.amtTotal }}</div>
          <div v-if="data.label == '税率(%)'">{{ props.info.supplierCloseCost.taxRate }}{{ props.info.supplierCloseCost.includeTax ? '（含税）' : '（不含税）' }}</div>
          <div v-if="data.label == '税金'">{{ props.info.supplierCloseCost.amtTax }}</div>
        </template>
      </a-descriptions>

      <div class="flex-c-end mt10">
        <a-button size="small" @click="visible = false">取消</a-button>
        <a-button class="ml10" :loading="submitLoading" type="primary" @click="submit">确认</a-button>
      </div>
    </template>
  </a-popover>
</template>

<script lang="ts" setup>
  import { defineComponent, ref } from 'vue'
  import { batchPurchaseVerify } from '@/api/purchase'
  import { Message } from '@arco-design/web-vue'
  const props = defineProps(['type', 'info'])
  const emits = defineEmits(['save'])
  let visible = ref(false)
  let submitLoading = ref(false)
  let deliveryInfo = ref([
    { label: '半成品毛坯供应方', tip: '' },
    { label: '数量', tip: '' },
    { label: '材质单价(元/g)', tip: '' },
    { label: '单件加工费', tip: '' },
    { label: '材质净重(g)', tip: '材质净重是指产品出库时扣除石头和链条之外的重量。' },
    { label: '损耗率(%)', tip: '生产加工过程中主材质的损耗率' },
    { label: '连耗重量(g)', tip: '连耗重量，是指净重加上损耗的重量。连耗重量=材质净重+（材质净重*损耗率）' },
    { label: '材质金额', tip: '材质金额=材质单价*连耗重量' },
    { label: '加工费', tip: '加工费=单件加工费*数量' },
    { label: '石头费用', tip: '如果石头是由供应商提供的，则供应商在交货的时候可以填上石头费用' },
    { label: '链条费用', tip: '如果链条是由供应商提供的，则供应商在交货的时候可以填上链条费用' },
    { label: '其他费用', tip: '本次定制单产生的其他费用' },
    { label: '合计金额', tip: '合计金额=材质金额+加工费+石头费用+链条费用+其他费用' },
    { label: '税率(%)', tip: '' },
    { label: '税金', tip: '税金=合计费用*税率' },
  ])

  let remark = ref('')

  const submit = async () => {
    if (props.type != 'signFor' && !remark.value) return Message.error('请填写拒收原因')

    let params = {
      accept: props.type == 'signFor' ? true : false,
      idList: [props.info.id],
      rejectReason: remark.value,
    }
    const res: any = await batchPurchaseVerify(params)
    if (res) {
      Message.success('操作成功')
      visible.value = false
      remark.value = ''
      emits('save')
    }
  }

  const getSupplierName = (data: any) => {
    if (data.supplierCloseCost.semiNoPick) {
      return '供应商'
    } else {
      return data.supplierCloseCost.semiWarehouseCode == 'CK86' ? '需求方' : '采购方'
    }
  }
</script>

<style lang="less" scoped></style>
